<template>

    <el-dialog v-model="dialogVisible" :title="flag ? '新增' : '编辑'" width="500">
        <el-form :model="formData" style="max-width: 600px">
            <el-form-item label="学生ID" v-if="!flag">
                <el-input v-model="formData.id" type="text" autocomplete="off" :disabled="!flag" />
            </el-form-item>
            <el-form-item label="学生学号">
                <el-input v-model="formData.stuNo" type="text" autocomplete="off" />
            </el-form-item>
            <el-form-item label="学生姓名">
                <el-input v-model="formData.stuName" />
            </el-form-item>
            <el-form-item label="学生班级">
                <el-input v-model="formData.className" />
            </el-form-item>
            <el-form-item label="学院名称">
                <el-input v-model="formData.collegeid" />
            </el-form-item>
            <el-form-item label="市场部">
                <el-input v-model="formData.origin" />
            </el-form-item>
            <el-form-item label="学生专业">
                <el-input v-model="formData.expertiseid" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="confirm">
                    确定
                </el-button>
                <el-button @click="cancel">取消</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>

    <el-dialog v-model="dialogVisible1" title="查看学生信息" width="500">
        <el-form style="max-width: 700px">
            <el-form-item label="编号">
                <el-text class="mx-1">{{ viewData.id }}</el-text>
            </el-form-item>
            <el-form-item label="姓名">
                <el-text class="mx-1">{{ viewData.stuName }}</el-text>
            </el-form-item>
            <el-form-item label="学号">
                <el-text class="mx-1">{{ viewData.stuNo }}</el-text>
            </el-form-item>
            <el-form-item label="班级">
                <el-text class="mx-1">{{ viewData.className }}</el-text>
            </el-form-item>
            <el-form-item label="出处">
                <el-text class="mx-1">{{ viewData.origin }}</el-text>
            </el-form-item>
            <el-form-item label="专业">
                <el-text class="mx-1">{{ viewData.createdTime }}</el-text>
            </el-form-item>
            <el-form-item>
                <el-button @click="closeViewDialog">关闭</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>

    <el-dialog v-model="uploadDialogVisible" title="用户导入" width="800">
        <el-upload class="upload-demo" drag action="#" :http-request="handleUpload" multiple>
            <el-icon class="el-icon--upload"><upload-filled /></el-icon>
            <div class="el-upload__text">
                将文件拖到此处，或 <em>点击上传</em>
            </div>
            <template #tip>
                111
            </template>
        </el-upload>
        <template #footer>
            <el-button type="primary" @click="confirmUpload">提交</el-button>
            <el-button @click="cancelUpload">关闭</el-button>
        </template>
    </el-dialog>
</template>

<script setup>
import { computed, ref, watch } from 'vue';

const props=defineProps({
        flag:Boolean,
        studentData:Object,
        viewData:Object,
        uploadVisible:Boolean
    })

    const emit=defineEmits(['submit','cancel','viewClose','uploadConfirm','uploadCancel'])

    const dialogVisible=ref(props.isEditMode)
    const dialogVisible1=ref(false) 
    const uploadDialogVisible=ref(props.uploadVisible)
    const formData=ref(props.studentData)
    const viewData=ref(props.viewData)

    const title=computed(()=>props.isEditMode?'新增':'编辑')

    const confirm=()=>{
        emit('submit',formData.value)
        dialogVisible.value=false 
    }

    const cancel=()=>{
        emit('cancel')
        dialogVisible.value=false
    }

    const handleUpload=(file)=>{

    }

    const confirmUpload=()=>{
        emit('uploadConfirm')
        uploadDialogVisible.value=false
    }

    const cancelUpload=()=>{
        emit('uploadCancel')
        uploadDialogVisible.value=false
    }

    watch(()=>props.uploadVisible,(newVal)=>{
        uploadDialogVisible.value=newVal
    })
</script>

<style scoped></style>
